<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我的订单</title>
    <link href="../css/myorder.css" rel="stylesheet">

</head>
<body>
<!--==================头部导航======================-->
<div class="nav">
    <div class="head-logo">
        <a href="" ></a>
    </div>
    <div class="head-nav">
        <ul>
            <li><a href="" class="first-item">首页</a> </li>
            <li><a href="">手机端</a> </li>
            <li><a href="">成为房东</a> </li>
            <li><a href="">房源订单中心</a> </li>
            <li><a href="">个人中心</a> </li>
            <li><a href="">帮助</a> </li>
        </ul>
    </div>
    <div class="head-login">
        <a href="">
            <img class="login-logo" src="../image/login-logo.svg"/>
            <span class="login-title">登录</span>
        </a>
        <a href="">
            <img class="regist-logo" src="../image/regist-logo.svg" >
            <span class="login-title">注册</span>
        </a>
    </div>
</div>
<!--=====================main==========================-->
<div class="main">
    <div class="main-left">
        <ul>
            <li class="headimg"><img src="../image/order_head.jpg"></li>
            <li class="customername">内裤外穿得小超人</li>
            <li class="useradmin">
                <a href="">订单管理</a>
                <a href="">个人信息</a>
            </li>
        </ul>
        <div class="order-admin">
            <h4>订单管理</h4>
            <ul>
                <li><span><img src="../image/order-admin.svg"></span><a href="">订单管理</a></li>
                <li><span><img src="../image/order-collection.svg"></span><a href="">我的收藏</a></li>
            </ul>
        </div>
        <div class="customer-info">
            <h4>用户信息</h4>
            <ul>
                <li><span><img src="../image/order-vip.svg"></span><a href="">我的会员</a></li>
                <li><span><img src="../image/order-userinfo.svg"></span><a href="">个人信息</a></li>
                <li><span><img src="../image/order-coupon.svg"></span><a href="">我的优惠劵</a></li>
                <li><span><img src="../image/order-news.svg"></span><a href="">消息提醒</a></li>
            </ul>
        </div>
    </div>
    <div class="main-right">
        <div class="order-form">
            <ul>
                <li><a href="">全部订单</a></li>
                <li><a href="">已付款订单</a></li>
                <li><a href="">未付款订单</a></li>
                <li><a href="">已完成订单</a></li>
                <li><a href="">已取消订单</a></li>
                <li><a href="">退款</a></li>
            </ul>
            <table cellpadding="0" cellspacing="0">
                <!--===========================表的属性===========================-->
                <tr>
                    <td class="house-info">房间</td>
                    <td class="order-id">订单编号</td>
                    <td class="order-price">订单价格</td>
                    <td class="order-time">时间</td>
                    <td class="order-state">订单状态</td>
                    <td class="order-teleno">房东电话</td>
                    <td class="order-opera">操作</td>
                </tr>
                <!--===========================表的内容==============================-->
                <tr class="form-main">
                    <td class="house-info1">
                        <a href="" class="order-house-img"><img src="../image/order_house1.jpg"></a>
                        <p>房间编号:256324</p>
                        <a href="" class="">【东华里】独享整套房源 一室一床</a>
                    </td>
                    <td class="order-id1">20210810205233401696</td>
                    <td class="order-price1">
                        <p>房价：￥178.00</p>
                        <p>入住天数：2</p>
                        <p>已优惠：￥0.00</p>
                        <p>实 付：￥356.00</p>
                    </td>
                    <td class="order-time1">
                        <p>入住时间：</p>
                        <p>2021-10-01</p>
                        <p>退房时间：</p>
                        <p>2021-10-03</p>
                    </td>
                    <td class="order-state1">
                        <p>已付款</p>
                        <p>【待入住】</p>
                    </td>
                    <td class="order-teleno1">18864298305</td>
                    <td class="order-opera1">
                        <p><a href="">取消订单</a> </p>
                        <p><a href="">详情 >></a> </p>
                    </td>
                </tr>
                <tr class="form-main">
                    <td class="house-info1">
                        <a href="" class="order-house-img"><img src="../image/order_house1.jpg"></a>
                        <p>房间编号:256324</p>
                        <a href="" class="">【东华里】独享整套房源 一室一床</a>
                    </td>
                    <td class="order-id1">20210810205233401696</td>
                    <td class="order-price1">
                        <p>房价：￥178.00</p>
                        <p>入住天数：2</p>
                        <p>已优惠：￥0.00</p>
                        <p>实 付：￥356.00</p>
                    </td>
                    <td class="order-time1">
                        <p>入住时间：</p>
                        <p>2021-10-01</p>
                        <p>退房时间：</p>
                        <p>2021-10-03</p>
                    </td>
                    <td class="order-state1">
                        <p>已付款</p>
                        <p>【待入住】</p>
                    </td>
                    <td class="order-teleno1">18864298305</td>
                    <td class="order-opera1">
                        <p><a href="">取消订单</a> </p>
                        <p><a href="">详情 >></a> </p>
                    </td>
                </tr>
            </table>
        </div>
        <div class="order-page">
            <ul class="page-main">
                <li><a href="">首页</a></li>
                <li><a href="">< 上一页</a></li>
                <li><span id="page-id">1</span></li>
                <li><a href="">下一页 ></a></li>
                <li><a href="">尾页</a></li>
            </ul>
        </div>
    </div>
</div>

</body>
</html>